import React, { useState, useEffect,useContext,createContext } from 'react'
import Add from './context04-add'

/* Props 需要在组件之间逐级进行传递，最底层的组件才能拿到 value 数据，
如果层级比较多的情况，会使代码很冗余。

Context 可以省略中间层级的传递过程，在需要使用的地方进行调用，
react会一级级向上查找最近的值。 */



// useContext 解决父子组件传值的问题,props 的问题
    // 是个组件
const Context = createContext()
function Context01() {
    // 变量和set+变量
    const [ count,setCount  ] = useState(0)    
    const add = (params) => {
        setCount(count+1)
    }

    
    return (
        <div>
            <button onClick={add}> 点击添加 </button> 
            {/* 数据的提供方 */}
            <Context.Provider value={count} >
                <Add></Add>
            </Context.Provider>
        </div>
    )
}

export {Context01,Context} 
